<template>
  <div class="panel panel-default">
    <div class="panel-heading">
      基本信息id:{{$route.params.id}}, query:{{$route.query | json }}
      <div class="pull-right">
        <div class="btn-group">
          <button type="button" @click="edit($route.params.id)" class="btn btn-xs btn-primary">
            修改基本信息
          </button>
        </div>
      </div>
    </div>
    <div class="panel-body">
      <div class="table-responsive">
        <table class="table table-hover">
          <tbody>
          <tr>
            <td width="20%">id:</td>
            <td>{{user.id}}</td>
          </tr>
          <tr>
            <td>username:</td>
            <td>{{user.username}}</td>
          </tr>
          <tr>
            <td>nickname：</td>
            <td>{{user.nickname}}</td>
          </tr>
          <tr>
            <td>mobile：</td>
            <td>{{user.mobile}}</td>
          </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>
</template>
<script>
  export default {
    data () {
      return {
        user: {}
      }
    },
    methods: {
      edit (id) {
        console.log('edit method:' + id)
      }
    },
    ready () {
      console.log('ready')
    },
    route: {
      data () {
        this.$http.get('/static/user.json')
          .then(function (ret) {
            this.user = ret.data
          })
      }
    }
  }
</script>
